<template>
    <div class="appra page" style="
    height: 100%;
    position: relative;
    z-index: 2;
    background-color: #f5f0f0;
">
        <formHeader :title="'全部评论'"></formHeader>
        <div class="box" style="width: 10rem;margin-top:1.3rem;"></div> 
         <cube-scroll
                class="scroll"
                ref="scroll"
                :data="items"
                @pulling-up="getData"
                :options="options">
            <appraise v-if="items" :comments="items"></appraise>
        </cube-scroll>
    </div>
</template>

<script>
    import formHeader from '@/components/form-header'
    import appraise from '@/components/appraise'
    import {getAppraise} from '@/api/order'
    export default {
        name: "appra",
        components:{appraise,formHeader},
        data(){
            return{
                items:[],
                options:{pullUpLoad: true},
                page:1
            }
        },
        activated() {
            this.getData()
        },
        methods:{
            getData(){
                getAppraise(this.$route.query.id,this.page).then(res=>{
                    if (this.page==1){
                        this.items = res.data
                    }else {
                        this.items = this.items.concat(res.data)
                    }
                    this.page++
                })
            }
        }
    }
</script>

<style scoped lang="stylus">
    .appra
        height 100%
        background-color: #f0f5f5
        position relative
        z-index 2
        .box
            width 100%
            padding-top 1.3rem